<!DOCTYPE html>
<html lang="zh">
<head>
	<meta charset="UTF-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"> 
	<meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,minimum-sclae=1.0,user-scalable=0">
	<title>键盘遮挡</title>
	<style>
		*{margin:0;padding:0;font-family:'microsoft yahei',SimSun}
		html,body{height: 100%;position: relative;}
		input{border: 1px solid #aaa;padding: 2px 10px;position: absolute;bottom:20px;left: 50%;margin-left:-87px;}
	</style>
</head>
<body>
	<input type="text">
	<script>
		window.addEventListener('resize', function() {
			if(
				document.activeElement.tagName === 'INPUT' ||
				document.activeElement.tagName === 'TEXTAREA'
				) {
				window.setTimeout(function() {
					if('scrollIntoView' in document.activeElement) {
						document.activeElement.scrollIntoView();
					} else {
						document.activeElement.scrollIntoViewIfNeeded();
					}
				}, 0);
			}
		});
		/*if (/Android/gi.test(navigator.userAgent)) {
			window.addEventListener('resize', function () {
				if (document.activeElement.tagName == 'INPUT' || document.activeElement.tagName == 'TEXTAREA') {
					window.setTimeout(function () {
						document.activeElement.scrollIntoViewIfNeeded();
					}, 0);
				}
				$('input').blur(function(){
					document.activeElement.scrollIntoViewIfNeeded();
				});
			})
		}*/
	</script>
</body>
</html>